<!DOCTYPE html>
<html lang="en">

<!-- Head tag -->
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- Title -->
    <title>KELION</title>
    <!-- Custom CSS -->
   
    <link rel="stylesheet" href="../markdown/css/editormd.preview.css">
     <link rel="stylesheet" href="../css/article.css">
</head>

<body>

<!-- Menu -->
<!-- Navigation -->
<nav class="navbar">
    <div class="container-fluid">
        <a class="home-link" href="../index.html">Home</a>

        <a class="archives-link" href="contact.html">Contact</a>
        <a class="archives-link" href="about.html">About</a>
        <a class="archives-link" href="tags.html">Tags</a>
        <div class=" toggle-hide mobile-inner-header-icon mobile-inner-header-icon-out">
            <span></span><span></span>
        </div>
    </div>
    <div class="mobile-inner-nav" role="navigation">
        <a href="tags.html" style="animation-delay: 0.1s;">Tags</a>
        <a href="about.html" style="animation-delay: 0.2s;">About</a>
        <a href="contact.html" style="animation-delay: 0.3s;">Contact</a>
    </div>
</nav>

<!-- Main Content -->
<!-- Page Header -->
<!-- Set your background image for this header in the theme's configuration: index_cover -->
<header class="intro-header">
    <div class="container">
        <div class="row">
            <div class="">
                <div class="site-heading">
                    <h1 class="user-name"></h1>
                    <hr class="small">
                    <span class="subheading"></span>
                </div>
            </div>
        </div>
    </div>
</header>

<!-- Main Content -->
<div class="container">
    <div class="row">
        <div id="test-editormd-view">
			<textarea style="display: none;" name="test-editormd-markdown-doc"></textarea>
		</div>
    </div>
</div>

<!-- Footer -->
<footer>
    <div class="">
    </div>
</footer>

<!-- 加载JS -->
<script src="../js/jquery-1.12.4.min.js"></script>
<script type="text/javascript" src="../js/jquery-1.12.4.min.js"></script>
<script src="../markdown/lib/marked.min.js"></script>
<script src="../markdown/lib/prettify.min.js"></script>
<script src="../markdown/lib/raphael.min.js"></script>
<script src="../markdown/lib/underscore.min.js"></script>
<script src="../markdown/lib/sequence-diagram.min.js"></script>
<script src="../markdown/lib/flowchart.min.js"></script>
<script src="../markdown/lib/jquery.flowchart.min.js"></script>
<script src="../markdown/editormd.js"></script>
<script type="text/javascript">
	function getQueryStringArgs() {
		//第207页
		//取得去掉字符串开头的问号后的字符串
		var qs = (location.search.length > 0 ? location.search.substr(1)
				: ""), args = {},
		//根据“&”号分割查询字符串，返回name = value格式的字符串数组。
		//[name1 = value1,name2 = value2]
		items = qs.length ? qs.split("&") : [], item = null, name = null, value = null, i = 0, len = items.length;
		for (i; i < len; ++i) {
			item = items[i].split("=");
			//[name1,value1];
			name = decodeURIComponent(item[0]);
			//name = name1;
			value = decodeURIComponent(item[1]);
			//value = value1;
			if (name.length) {
				args[name] = value;
			}
		}
		return args;
	}
	$(function() {
		var args = getQueryStringArgs();
		var id = args["id"];
		var testEditormdView, testEditormdView2;
		$.ajax({
			url : "../getById.do",
			type : "Get",
			data : {
				"id" : id
			},
			dataType : "json",
			success : function(msg) {
				testEditormdView = editormd.markdownToHTML(
						"test-editormd-view", {
							markdown : msg["articles"][0].mdtxt,//+ "\r\n" + $("#append-test").text(),
							htmlDecode : "style,script,iframe", // you can filter tags decode
							tocm : true, // Using [TOCM]
							emoji : true,
							taskList : true,
							tex : true, // 默认不解析
							flowChart : true, // 默认不解析
							sequenceDiagram : true, // 默认不解析
						});
				$(".user-name").text(msg["articles"][0].title);
				$(".subheading").text(msg["articles"][0].publish_time);
			},
			error : function(er) {
				console.log(er);
			}
		//console.log("返回一个 jQuery 实例 =>", testEditormdView);
		// 获取Markdown源码
		//console.log(testEditormdView.getMarkdown());
		//alert(testEditormdView.getMarkdown());
		});
	});
	
	/*
	*头部导航
	*/
	$(document).ready(function () {
        function toggleNavClass() {
            $(this).toggleClass("mobile-inner-header-icon-click mobile-inner-header-icon-out");
            $(".mobile-inner-nav").slideToggle(250);
        }
        var headerIcon = document.getElementsByClassName("mobile-inner-header-icon")[0];
        headerIcon.addEventListener("click", toggleNavClass, false);

        $(".mobile-inner-nav a").each(function (index) {
            $(this).css({'animation-delay': (index / 10) + 's'});
        });
    });
</script>
</body>
</html>